<template>
<div>

  <!--    高级查询-->
  <el-row>
    <el-form :inline="true" :model="admContactsForm" >

      <el-col :span="2.5">
        <el-form-item>
          <el-input v-model="admContactsForm.selContactsPlusData" placeholder="单位/部门/联系人/手机"></el-input>
        </el-form-item>
      </el-col>

      <el-col :span="1.5">
        <el-form-item>
          <el-button type="primary" plain @click="queryAdmContacts" icon="el-icon-search">检索</el-button>
        </el-form-item>
      </el-col>


    <el-col :span="2">
    <el-button type="primary" @click="addAdmContacts" plain>添加</el-button>
    </el-col>
    </el-form>
  </el-row>

  <el-table
      :data="admContactsData"
      style="width: 100%">
    <el-table-column
        prop="unitname"
        label="单位名称"
        width="180">
    </el-table-column>
    <el-table-column
        prop="contactDept"
        label="部门"
        width="180">
    </el-table-column>
    <el-table-column
        prop="contactName"
        label="联系人">
    </el-table-column>
    <el-table-column
        prop="contactPhone"
        label="手机号码">
    </el-table-column>
    <el-table-column
        prop="contactTel"
        label="固定电话">
    </el-table-column>

    <el-table-column
        fixed="right"
        label="操作"
        width="120">

      <template slot-scope="scope">
<!--
  //placement=""bottom"  这是弹出的位置，详情可见参数配置  trigger="click" 为点击方式，删除为hover方式
  -->
        <el-dropdown placement="bottom" trigger="click">
         <el-button type="text" size="small">操作</el-button>
          <el-dropdown-menu slot="dropdown">
<!--
  v-if="scope.row.reviewStatus == 101"
  //注意：直接写@click是无效的，需要加上修饰符 .native    括号里面的就是点击当条数据的所有参数
  -->
            <el-dropdown-item  @click.native="queryBtn(scope.row)">查看</el-dropdown-item>
            <el-dropdown-item  @click.native="updateBtn(scope.row)">修改</el-dropdown-item>
            <el-dropdown-item @click.native="delBtn(scope.row)">删除</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>

<!--        <el-button type="text" @click="ChaKan(scope.row.id)"  size="small">查看</el-button>-->
      </template>
    </el-table-column>


</el-table>


</div>
</template>

<script>
export default {
  name: "AdmContacts",
  data(){
    return{
      admContactsData:[],//查询出的数据
      admContactsForm:{selContactsPlusData:""},// 高级查询的参数
    }
  },
  created() {
this.queryAdmContacts();

  },
  methods:{
    queryAdmContacts(){

      const loading = this.$loading({
        lock: true,
        text: '正在载入...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      });

      this.$http.get("admContacts",{params:{"selPlusData":this.admContactsForm.selContactsPlusData}})
          .then(res => {
            setTimeout(() => {
              loading.close();
            });
            this.admContactsData=res.data.data
          })
          .catch()

    },
    ChaKan(){//查看详情
      // alert(id)
    },
    addAdmContacts(){  //添加联系人
      this.$router.push({name:"addadmcontacts"})
    },
    queryBtn( row){ //查看
      // alert( row.id)
    this.$router.push({name:"queryadmcontacts",params:{id:row.id}})

    },
    updateBtn(row){ //修改
      this.$router.push({name:"addadmcontacts",params:{id:row.id}});
    },
    delBtn(row){ //删除

      this.$confirm("确定删除", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
          .then(() => {
            this.delFun(row.id);
          })
          .catch(() => {});



    },
    delFun(id){//删除方法
      const loading = this.$loading({
        lock: true,
        text: '正在载入...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      });

      this.$http.delete(`admContacts/${id}`)
          .then( () => {
            setTimeout(() => {
              loading.close();
            });
            this.$message({
              message: '删除成功!',
              type: 'success'
            });
            this.queryAdmContacts()
          })
          .catch()
    }



    //   this.$confirm('确认删除？')
    //       .then( ()  => {
    //         this.$http.delete(`admContacts/${row.id}`)
    //         .then(
    //             this.queryAdmContacts()
    //         )
    //         .catch()
    //
    //       })
    //       .catch(() => {});
    // }


  }
}
</script>

<style scoped>

</style>